<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	String path = request.getContextPath();//获得项目的根目录，上下文路径
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>超市账单管理系统</title>
<link rel="stylesheet" href="css/public.css" />
<link rel="stylesheet" href="css/style.css" />
<link href="jquery-easyui-1.6.6/themes/default/easyui.css" rel="stylesheet">
<link href="jquery-easyui-1.6.6/themes/icon.css" rel="stylesheet">
<script type="text/javascript" src="jquery-easyui-1.6.6/jquery.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.6.6/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.6.6/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
$(function(){
  	$(".numberPlus").click(function(){
	  		var t=$(this).parent().find('input[class*=textNum]');
	  			t.val(parseInt(t.val())+1)
  		})
  	$(".numberMinus").click(function(){
  		var t=$(this).parent().find('input[class*=textNum]');
  			t.val(parseInt(t.val())-1)
  		if(parseInt(t.val())<1){
  		t.val(1);
  		}
  	})
  })
  // 5、点击查询
$(function() {
	$("#seacher").click(function() {
		var goodsName = $("#goodsName").val();
		location = "goodsList.du?goodsName=" + goodsName;
	});
});

//1、测试用户编码是否唯一$.ajax()，表单验证
$(function() {
	$(".add").click(function() {
		testGoods($(this));
	});
});

function testGoods(t) {
	var sp = t.next();
	var div = t.parent();
	var num=t.parent().parent().find("td:eq(3) .textNum").val();
	var id =t.val();
	var userId=$(".userId").val()
	sp.empty();
	var flag = false;
	$.ajax({
		url : "goodsAdd.du",
		data : {
			num : num,
			id : id,
			userId : userId
		},
		type : "POST",
		dataType : "json",
		success : function(res) {
			//如果占用返回false，否则反回true
			console.log(res);
			flag = res.result;
			if (!flag) {
				alert("添加失败！");
			} else {
				alert("添加成功！");
			}
		},
		error : function(e) {
			alert("请求出错了，" + e);
		},
		cache : false,
		//同步请求
		async : false
	});
	return flag;
}
</script>
</head>
<body>
	<!--头部-->
	<header class="publicHeader">
		<h1>超市账单管理系统</h1>
		<div class="publicHeaderR">
			<p>
				<span>下午好！</span>
				<span style="color: #fff21b"> ${USER_LOGIN.userName}</span>
				, 欢迎你！
			</p>
			<a href="logOut.html">退出</a>
		</div>
	</header>
	<!--时间-->
	<section class="publicTime">
		<span id="time">2015年1月1日 11:11 星期一</span>
		<a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
	</section>
	<!--主体内容-->
	<section class="publicMian ">
		<div class="left">
			<h2 class="leftH2">
				<span class="span1"></span>
				功能列表
				<span></span>
			</h2>
			<nav>
				<ul class="list">
					<li><a href="billList.html">账单管理</a></li>
					<li><a href="providerList.ht">供应商管理</a></li>
					<li><a href="userList.html">用户管理</a></li>
					<li><a href="roleList.html">角色管理</a></li>
					<li><a href="password.html">密码修改</a></li>
					<li id="active"><a href="goodsList.du">商品购买</a></li>
					<li><a href="logOut.html">退出系统</a></li>
				</ul>
			</nav>
		</div>
		<div class="right">
			<div class="location">
				<strong>你现在所在的位置是:</strong>
				<span>商品购买</span>
			</div>
			<div class="search">
				<span>商品名：</span>
				<input type="text" id="goodsName" placeholder="请输入商品名" value="${GOODSNAME}" />
				<input type="button" value="查询" id="seacher" />
				<a href="buyList.du">查看购物车</a>
			</div>
			<!--用户-->
			<table class="providerTable" cellpadding="0" cellspacing="0">
				<tr class="firstTr">
					<th width="15%">商品编码</th>
					<th width="10%">商品名</th>
					<th width="10%">单价</th>
					<th width="10%">数量</th>
					<th width="15%">单位</th>
					<th width="20%">操作</th>
				</tr>
				<c:forEach items="${PAGE.list }" var="goods" varStatus="num">
					<tr>
						<td>${goods.goodsCode}</td>
						<td>${goods.goodsName}</td>
						<td>${goods.goodsPrice}</td>
						<td>
						<!-- 选择数量  ${item.productNum*item.price} 隐藏库存-->
						<div class="cartProductChangeNumberDiv">
							<input type="hidden" name="action" value="updateInfo">
							<input type="hidden" class="id" name="id" value="${goods.id}">
							<input type="hidden" class="userId" name="userId" value="${USER_LOGIN.id}">
							<input type="button" name="minus" value="-"class="numberMinus" />
							<input type="text" name="num" value=1 class="textNum" style="width:30px; text-align: center;" />
							<!-- 应该限制库存 ，未做-->
							<input type="button" name="add" value="+" class="numberPlus" />
						</div>
						</td>
						<td>${goods.goodsUnit}</td>
						<td>
							<button class="add" value="${goods.id}" class="easyui-linkbutton">
								<img src="img/foods.png" alt="添加购物车" title="添加购物车" />
							</button>
						</td>
					</tr>
				</c:forEach>
			</table>
			<!-- 分页 -->
			<div class="pages" align="center">
				<a href="goodsList.du?pageNum=1&goodsName=${GOODSNAME}" class="easyui-linkbutton">首页</a>
				<a href="goodsList.du?pageNum=${PAGE.pageNum-1 }&goodsName=${GOODSNAME}" class="easyui-linkbutton">上一页</a>
				<a href="goodsList.du?pageNum=${PAGE.pageNum+1 }&goodsName=${GOODSNAME}" class="easyui-linkbutton">下一页</a>
				<a href="goodsList.du?pageNum=${PAGE.totalPage }&goodsName=${GOODSNAME}" class="easyui-linkbutton">尾页</a>
				<span>第</span>
				<span>${PAGE.pageNum}</span>
				页，
				<span>共</span>
				<span>${PAGE.totalPage}</span>
				页
				<input type="text" value="${PAGE.pageNum }" class="easyui-textbox" id="goPage" style="width: 60px;" />
				<button id="btnGo" class="easyui-linkbutton">Go</button>
			</div>
		</div>
	</section>
</body>
</html>